iT邦幫忙

2024 iThome 鐵人賽

DAY 18
0

CheckBox是一種常見的UI元件
點擊它可以用來選擇表示同意此項目或者取消選擇不同意此項目
常用於記住帳號、我不是機器人等

這邊用一個簡單的例子
我讓CheckBox在打勾前後可以看到不同的狀態的按鈕

  • 這是CheckBox未打勾的樣子
    https://ithelp.ithome.com.tw/upload/images/20240926/20168456WH2wpyWUfD.png
  • 這是CheckBox打勾的樣子
    https://ithelp.ithome.com.tw/upload/images/20240926/20168456GqQNXirB09.png

至於裡頭Button的狀態我們可以利用enabled屬性來控制

android:enabled="false"

xml的Button中使用enabled屬性可以控制Button剛開始執行時的狀態
這邊先將Button的預設設置成了未啟用的狀態了

接著再到MainActivity裡去變更Button的設置
讓它在某個特定條件達成時將Button啟用,否則會維持原樣(未啟用)

private CheckBox robotCb;
private  Button checkBtn;

首先設定好變數個別的元件變數

robotCb = findViewById(R.id.main_checkBox_cb);
checkBtn = findViewById(R.id.main_button_btn);

接著在將元件們與變數分別綁定

robotCb.setOnCheckedChangeListener(new CompoundButton.OnCheckedChangeListener() {
        @Override
        public void onCheckedChanged(CompoundButton compoundButton, boolean b) {
            checkBtn.setEnabled(robotCb.isChecked());
        }
    });

最後設置CheckBox的監聽器
這裡的setOnCheckedChangeListener是用來監聽CheckBox是否有改變的監聽器
(這裡利用此監聽器來控制Button的狀態)
當CheckBox被選取時,將Button設為可用的
未選取時將Button設為不可用的

下面是完整的程式碼

xml

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/main"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

    <androidx.constraintlayout.widget.Guideline
        android:id="@+id/guideline3"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="vertical"
        app:layout_constraintGuide_percent="0.15085158" />

    <androidx.constraintlayout.widget.Guideline
        android:id="@+id/guideline4"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="vertical"
        app:layout_constraintGuide_percent="0.8807786" />

    <androidx.constraintlayout.widget.Guideline
        android:id="@+id/guideline5"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        app:layout_constraintGuide_percent="0.47" />

    <androidx.constraintlayout.widget.Guideline
        android:id="@+id/guideline6"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        app:layout_constraintGuide_percent="0.57" />

    <Button
        android:id="@+id/main_button_btn"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Button"
        android:enabled="false"
        app:layout_constraintBottom_toTopOf="@+id/guideline6"
        app:layout_constraintEnd_toStartOf="@+id/guideline4"
        app:layout_constraintStart_toStartOf="@+id/guideline3"
        app:layout_constraintTop_toTopOf="@+id/guideline5" />

    <CheckBox
        android:id="@+id/main_checkBox_cb"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:text="CheckBox"
        app:layout_constraintBottom_toTopOf="@+id/guideline5"
        app:layout_constraintEnd_toStartOf="@+id/guideline4"
        app:layout_constraintStart_toStartOf="@+id/guideline3"
        app:layout_constraintTop_toTopOf="@+id/guideline" />

    <androidx.constraintlayout.widget.Guideline
        android:id="@+id/guideline"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        app:layout_constraintGuide_percent="0.4" />

</androidx.constraintlayout.widget.ConstraintLayout>

MainActivity

package com.example.test_2;

import android.os.Bundle;
import android.view.View;
import android.widget.Button;
import android.widget.CheckBox;
import android.widget.CompoundButton;

import androidx.activity.EdgeToEdge;
import androidx.appcompat.app.AppCompatActivity;

public class MainActivity extends AppCompatActivity {
    private CheckBox robotCb;
    private  Button checkBtn;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        EdgeToEdge.enable(this);
        setContentView(R.layout.activity_main);

        robotCb = findViewById(R.id.main_checkBox_cb);
        checkBtn = findViewById(R.id.main_button_btn);

        robotCb.setOnCheckedChangeListener(new CompoundButton.OnCheckedChangeListener() {
            @Override
            public void onCheckedChanged(CompoundButton compoundButton, boolean b) {
                checkBtn.setEnabled(robotCb.isChecked());
            }
        });
    }
}

CheckBox的介紹就到這裡了
下篇會介紹Dialog


上一篇
[Day 17] Spinner介紹
下一篇
[Day 19] Dialog介紹
系列文
深入Android Java程式語言 - 打造我的行動應用30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言